<template>
    <div class="affiliatedWay">
        <div  class="common_br">
            <h2 class="common_title extra_title" >挂靠信息
                <span v-show="!isShowDetails"@click="saveAffiliated()" class="saveBtn">保存</span>
            </h2>
            <div class="common_content">
                <div v-if="tempAffiMode=='01'">
                    <Row>
                        <Col span="8">
                            <FormItem label="公司名称" prop="affiliatedId">
                                <Select
                                v-model="affiliatedForm.affiliatedId"
                                placeholder="请输入搜索"
                                class="w200"
                                filterable
                                remote
                                :remote-method="remoteAffilateName"
                                :loading="loadModel"
                                @on-change="selecteAffiliatedName($event,'01')"
                                @on-open-change="openAffiliateName"
                                @on-query-change="queryAffilateName"
                                :disabled="isShowDetails||isReconsider"
                                >
                                   <Option :value="item.id" v-for="(item,index) in companyList" :key="index" :disabled="item.monthlySurplusNum=='0'||item.totalSurplusNum=='0'||item.relStatus=='05'">{{item.affiliatedName}}</Option>
                               </Select>
                            </FormItem>
                        </Col>
                        <Col span="8">
                            <FormItem label="统一信用社会代号" prop="socUniCrtCode">
                                <Input v-model="affiliatedForm.socUniCrtCode" class="w200" :disabled="isdisabled||isReconsider" placeholder="选择挂靠公司后自动带入"/>
                            </FormItem>
                        </Col>
                        <Col span="8">
                            <FormItem label="法人姓名" prop="legalName">
                                <Input v-model="affiliatedForm.legalName" class="w200" :disabled="isdisabled||isReconsider" placeholder="选择挂靠公司后自动带入"/>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <Col span="8">
                            <FormItem label="联系电话" prop="legalPhone">
                                <Input v-model="affiliatedForm.legalPhone" class="w200" :disabled="isdisabled||isReconsider" placeholder="选择挂靠公司后自动带入"/>
                            </FormItem>
                        </Col>
                        <Col span="8">
                            <FormItem label="运输许可证有效期" prop="licenceEndDate">
                                <Input v-model="affiliatedForm.licenceEndDate" class="w200" :disabled="isdisabled||isReconsider" placeholder="选择挂靠公司后自动带入"/>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row>
                        <!-- <Col span="16"> -->
                            <place-cascade
                            :value="registValue"
                            :form="affiliatedForm"
                            :label="registLabel"
                             :isDetailAddress="true"
                             :location="location"
                             :detailValue="registDetail"
                             :isShowDetails="isShowDetails"
                             :isReconsider="isReconsider"
                             :companyAffi="companyAffi"
                             ></place-cascade>
                        <!-- </Col> -->
                    </Row>
                </div>
                <!-- 个体工商户 -->
                <div v-if="tempAffiMode=='02'">
                    <Row>
                        <Col span="24">
                            <FormItem label="个体工商挂靠名称" prop="affiliatedName"   class="tip_msg">
                                <Input v-model="affiliatedForm.affiliatedName" class="w200"  placeholder="请输入" :disabled="isShowDetails||isReconsider"/>
                                <span>(不允许出现有限公司、有限责任公司和股份有限公司文字)</span>
                            </FormItem>
                        </Col>
                    </Row>
                </div>
                <!-- 网约车 -->
                <div v-if="tempAffiMode=='03'">
                    <Row>
                        <Col span="8">
                            <FormItem label="运营公司" prop="affiliatedId">
                                <Select v-model="affiliatedForm.affiliatedId"
                                placeholder="请选择"
                                class="w200"
                                @on-open-change="queryCompanyList($event,'03')"
                                @on-change="selecteAffiliatedName($event,'03')"
                                :label-in-value="true"
                                :disabled="isShowDetails||isReconsider"
                                >
                                    <Option :value="item.id" v-for="(item,index) in companyList" :key="index" :disabled="item.relStatus=='05'">{{item.affiliatedName}}</Option>
                                </Select>
                            </FormItem>
                        </Col>
                        <Col span="8">
                            <FormItem label="网约车平台" prop="platformId">
                                <Select v-model="affiliatedForm.platformId"
                                placeholder=""
                                class="w200"
                                @on-open-change="queryPlatList"
                                @on-change="selectePlateName"
                                :label-in-value="true"
                                :disabled="isShowDetails||isReconsider"
                                >
                                    <Option :value="item.id" v-for="(item,index) in plateList" :key="index" >{{item.cooperPlat}}</Option>
                                </Select>
                            </FormItem>
                        </Col>
                    </Row>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import {
    saveAffiliatedUnit,
    updateAffiliatedUnit,
    getAffiliatedUnitsList,
    getCooperPlatList
} from '_p/afs-apply/api/apply-report/personal/businessOption.js'
import PlaceCascade from "@/components/place-cascade"
import {
    getDictDataByType
} from "_p/basic/api/admin/datadic.js";
export default {
    name:"affiliatedWay",
    data(){
        return{
            loadModel:false,
            affiliatedName:"",
            cooperPlatform:"",
            companyAffi:false,
            tempSocUniCrtCode:"",//网约车挂靠的code

            registLabel:'注册地点',
            registValue:"registLocation",
            registDetail:"registAddress",

            isdisabled:true,
            isTipMsg:false,
            // 公司列表
            companyList:[
            ],
            // 网约车列表
            plateList:[
            ],
        }
    },
    props:{
        affiliatedForm:{
            type:Object,
            require: true
        },
        tempAffiMode:{
            type:String,
            require:true
        },
        applyNo:{
            // type:String,
        },
        tempaffiliatedId:{
            type:String
        },
        capitalId:{
            type:String
        },
        location:{
            type:Array,
            require:true,
        },
        tempChannelId:{
            type:String,
        },
        tempAffiInfo:{
            type:Object,
        },
        isShowDetails:{
            type:Boolean,
        },
        isReconsider:{
            type:Boolean,
        },
        valiateAffiliated:{
            type:Function
        },
        businessTypeForm:{
            type:Object
        }
    },
    components:{
        PlaceCascade
    },
    watch:{
        tempAffiInfo(val){
            if(Object.keys(val).length>0){
                this.affiliatedName=val.affiliatedName;
                if(this.tempAffiMode!="02"){
                    let tempCompanyList=[];
                    let companyObj={
                        id:val.affiliatedId,
                        affiliatedName:val.affiliatedName,
                        monthlySurplusNum:val.monthlySurplusNum,
                        totalSurplusNum:val.totalSurplusNum,
                        relStatus:val.relStatus,
                    }
                    tempCompanyList.push(companyObj);
                    this.companyList=tempCompanyList;

                    this.affiliatedForm.affiliatedId=val.affiliatedId;
                    if(this.tempAffiMode=="01"){
                       this.companyAffi=true;
                    }
                }
                // 初始化构造网约车列表
               if(this.tempAffiMode=="03"){
                    let tempPlateList=[];
                    let plateObj={
                        id:val.platformId,
                        cooperPlat:val.cooperPlatform,
                    }
                    this.cooperPlatform=val.cooperPlatform;
                    tempPlateList.push(plateObj);
                    this.plateList=tempPlateList;
                    this.tempSocUniCrtCode=val.socUniCrtCode
               }
            }
        },
        tempAffiMode(val){
            this.affiliatedName='';
            this.companyList=[];
        }
    },
    created(){

    },
    mounted(){
    },
    methods:{
        showTipMsg(){
            this.isTipMsg=true;
        },
        hideTipMsg(){
            this.isTipMsg=false;
        },
        remoteAffilateName(val){

        },
        queryAffilateName(val){
            if(val!=this.affiliatedForm.affiliatedId){
                this.queryAffiliatedCompany("01",val);
            }
        },
        // 一聚焦表单值为空就调接口
        openAffiliateName(val){
            if(val){
                if(!this.affiliatedForm.affiliatedId){
                     this.queryAffiliatedCompany("01")
                }
            }
        },
        // 点击保存挂靠信息
        saveAffiliated(){
            if(!this.applyNo){
                this.$Message.warning("请先保存业务类型");
                return;
            }
            if(!this.valiateAffiliated()){
                return false;
            }
            let param={
                applyNo:this.applyNo,
                affiliatedType:this.tempAffiMode,
                carId:this.capitalId,
                businessType:this.businessTypeForm.businessType,
                carType:this.businessTypeForm.carType,
                carNature:this.businessTypeForm.carNature,
                carPurpose:this.businessTypeForm.carPurpose,
                affiliatedWay:this.businessTypeForm.affiliatedWay,
                operateWay:this.businessTypeForm.operateWay,
            }
            // 公司挂靠
            if(this.tempAffiMode=="01"){
                param.affiliatedId=this.affiliatedForm.affiliatedId;
                param.affiliatedName=this.affiliatedName;
                param.socUniCrtCode=this.affiliatedForm.socUniCrtCode;
                param.legalName=this.affiliatedForm.legalName;
                param.legalPhone=this.affiliatedForm.legalPhone;
                param.licenceEndDate=this.affiliatedForm.licenceEndDate;
                param.registProvince=this.affiliatedForm.registLocation[0];
                param.registCity=this.affiliatedForm.registLocation[1];
                param.registAddress=this.affiliatedForm.registAddress;

            }
            // 个体工商户
            else if(this.tempAffiMode=="02"){
                param.affiliatedName=this.affiliatedForm.affiliatedName;
            }
            // 网约车
            else if(this.tempAffiMode=="03"){
                param.affiliatedId=this.affiliatedForm.affiliatedId;
                param.affiliatedName=this.affiliatedName;
                param.socUniCrtCode=this.tempSocUniCrtCode;
                param.platformId=this.affiliatedForm.platformId;
                param.cooperPlatform=this.cooperPlatform;
            }

            if(this.tempaffiliatedId){
                param.id=this.tempaffiliatedId;
                updateAffiliatedUnit(param).then(res=>{
                    if(res.code=="0000"){
                        this.$Message.success("更新挂靠信息成功");
                    }
                })
            }else{
                saveAffiliatedUnit(param).then(res=>{
                    if(res.code=="0000"){
                        this.$emit('saveAffiliatedId',res.data.id)
                        this.$Message.success("保存挂靠信息成功");
                    }
                })
            }

        },
        // 总保存需要的挂靠信息入参
        passAffiData(){
            let param={
                affiliatedType:this.tempAffiMode,
                carId:this.capitalId
            }
            // 公司挂靠
            if(this.tempAffiMode=="01"){
                param.affiliatedId=this.affiliatedForm.affiliatedId;
                param.affiliatedName=this.affiliatedName;
                param.socUniCrtCode=this.affiliatedForm.socUniCrtCode;
                param.legalName=this.affiliatedForm.legalName;
                param.legalPhone=this.affiliatedForm.legalPhone;
                param.licenceEndDate=this.affiliatedForm.licenceEndDate;
                param.registProvince=this.affiliatedForm.registLocation[0];
                param.registCity=this.affiliatedForm.registLocation[1];
                param.registAddress=this.affiliatedForm.registAddress;

            }
            // 个体工商户
            else if(this.tempAffiMode=="02"){
                param.affiliatedName=this.affiliatedForm.affiliatedName;
            }
            // 网约车
            else if(this.tempAffiMode=="03"){
                param.affiliatedId=this.affiliatedForm.affiliatedId;
                param.affiliatedName=this.affiliatedName;
                param.socUniCrtCode=this.tempSocUniCrtCode;
                param.platformId=this.affiliatedForm.platformId;
                param.cooperPlatform=this.cooperPlatform;
            }
            if(this.tempaffiliatedId){
                param.id=this.tempaffiliatedId;
            }
            return param;

        },
        queryCompanyList(val,type){
            if(val){
                this.queryAffiliatedCompany(type)
            }
        },
        queryPlatList(val){
            if(val){
                this.queryCooperPlatList(this.tempSocUniCrtCode);
            }
        },
        // 查询挂靠公司列表
        queryAffiliatedCompany(type,searchValue){
             let param={
                affiliatedType:this.tempAffiMode,
             }
             if(type=="01"){
                 param.affUnitsName=searchValue;
             }else if(type=="03"){
                 param.affUnitsName="";
                 this.companyList=[];
             }
            getAffiliatedUnitsList(param).then(res=>{
                if(res.code=="0000"){
                    this.companyList=res.data
                }
            })
        },
        // 查询网约车列表
        queryCooperPlatList(socUniCrtCode){
           let param={
                socUniCrtCode:socUniCrtCode,//选择挂靠名称返回
           }
           if(socUniCrtCode){
                getCooperPlatList(param).then(res=>{
                    if(res.code=="0000"){
                        // this.initDataic(res.data[1].cooperPlat)
                        this.initDataic(res.data.cooperPlat)
                    }
                })
           }else{
             this.$Message.warning("请先选择运营公司")
           }
        },
        // 获取数据字典
        initDataic(cooperPlat){
            this.plateList=[];
            let param={
                type:"netCarCooperPlat",
            };
            getDictDataByType(param.type).then(res=>{
                if(res.code=="0000"){
                    let tempArr=[];
                    res.data.forEach((item,index)=>{
                        if(cooperPlat.indexOf(item.value)!="-1"){
                            let obj={
                                id:item.value,
                                cooperPlat:item.title,
                            }
                            tempArr.push(obj);
                        }
                    })
                    this.plateList=tempArr;
                }
            })
        },
        // 当挂挂靠公司列表下拉框数据改变时
        selecteAffiliatedName(event,type){
            if(event){
                // 公司挂靠
                if(type=="01"){
                    this.companyList.forEach((item,index)=>{
                        // 匹配id对应相应的参数
                        if(item.id==event){
                            this.affiliatedName=item.affiliatedName;
                            this.affiliatedForm.socUniCrtCode=item.socUniCrtCode;
                            this.affiliatedForm.legalName=item.legalPersonName;
                            this.affiliatedForm.licenceEndDate=item.transPermitValidity;
                            this.affiliatedForm.legalPhone=item.legalPersonTel;
                            this.affiliatedForm.registAddress=item.registeredAddress;
                            let tempArr=[];
                            tempArr[0]=item.registeredProvince;
                            tempArr[1]=item.registeredCity;
                            this.$set(this.affiliatedForm,'registLocation',tempArr);
                            let affiliatedField=['socUniCrtCode','legalName',"legalPhone",'registAddress','registLocation'];
                            this.$emit('checkAffiliateCar',affiliatedField);
                            this.companyAffi=true;
                        }
                    })
                }else if(type=="03"){
                    this.affiliatedName=event.label;
                    this.companyList.forEach((item,index)=>{
                        if(item.id==event.value){
                            this.tempSocUniCrtCode=item.socUniCrtCode;
                            let tempLocation=[];
                            tempLocation[0]=item.registeredProvince;
                            tempLocation[1]=item.registeredCity;
                            if(item.registeredProvince&&item.registeredCity){
                                this.$emit('queryRecordAddress',tempLocation)
                            }
                        }
                    })
                }
            }else{
                this.companyList=[];
            }
        },
        selectePlateName(event){
            if(event){
                this.cooperPlatform=event.label;
            }
        }
    }
}
</script>
<style scoped>
    .tip_img{
        position: absolute;
        cursor: pointer;
        top: 0px;
        left: 230px;
    }
    .tip_img>img{
        width: 20px;
        margin-top: 8px;
    }
    .tip_img>i{
        position:absolute;
        top: -37px;
        min-width:220px;
        left: -100px;
        line-height: 16px;
        font-style: normal;
        text-align: center;
        background-color: #727272;
        color:white;
        border-radius: 5px;

    }
    .tip_img>i::after{
        content:"" ;
        width:0;
        height:0;
        border-width:12px 5px 0;
        border-style:solid;
        border-color:#727272 transparent transparent;
        margin:40px auto;
        position:absolute;
        top:-10px;
        left:50%;
        transform: translateX(-50%);
    }
    /* .tip_msg>>>label{
        margin-right: 20px;
    }
    .tip_msg>>>.ivu-form-item-error-tip{
        left:20px;
    } */
</style>
